<template>
    <div>
        我是父组件
        <button @click="showmodelFn">显示模态框</button>
        <!-- 使用模态框组件,下面就用modal 表示表示组件实例 -->
        <myModel ref="modal"></myModel>
    </div>
</template>

<script lang='ts' setup>

import { ref } from 'vue';
//  引入子组件模块框
import myModel from '@/components/myModel.vue';
// 指定model实例的类型
const modal = ref<InstanceType<typeof myModel> | null>(null);

// 或者也可以不使用指定类型
// 注意: 当给子组件设置ref属性时, ref 的值是什么,那么 定义组件的实例的时候,就使用什么变量
// const modal = ref();

const showmodelFn = () => {
    console.log(modal); // 当前的组件的实例对象
    modal.value?.openModel()
}

</script>
<style scoped>

</style>